body,
page,
view {
	box-sizing: border-box;
	flex-shrink: 0;

}

body {
	font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma,
		Arial, PingFang SC-Light, Microsoft YaHei;
	margin: 0;
	color: #333333;
	font-size: 28upx;
}

button {
	margin: 0;
	padding: 0;
	border: 1px solid transparent;
	outline: none;
	background-color: transparent;
}
/* 颜色列表 */
$colors: (
  theme: #588ce5,
  whiteF: #FFFFFF,
);
@each $name, $color in $colors {
	.color-#{$name} {
		color: $color;
	}
	.bg-#{$name} {
		background-color: $color;
	}
}
//透明度
@for $i from 0 through 10 {
  .bg-alpha#{$i} {
    background-color: rgba(255, 255, 255, $i * 0.1);
  }
  .color-alpha#{$i} {
    color: rgba(0, 0, 0, $i * 0.1);
  }
  .opacity#{$i} {
    opacity: $i * 0.1;
  }
}
/** 基础通用 
margin 
paddign 
font-size 
border-radius 
z-index left 
right top bottom 
width height lineheight  
根据自己的范围定义**/
@for $i from 0 through 500 {
	//margin
	.m#{$i} {
		margin: #{$i}rpx !important;
	}

	.mx#{$i} {
		margin: 0 #{$i}rpx !important;
	}

	.my#{$i} {
		margin: #{$i}rpx 0 !important;
	}

	.mt#{$i} {
		margin-top: #{$i}rpx !important;
	}

	.mb#{$i} {
		margin-bottom: #{$i}rpx !important;
	}

	.mr#{$i} {
		margin-right: #{$i}rpx !important;
	}

	.ml#{$i} {
		margin-left: #{$i}rpx !important;
	}

	//padding
	.p#{$i} {
		padding: #{$i}rpx !important;
	}

	.px#{$i} {
		padding: 0 #{$i}rpx !important;
	}

	.py#{$i} {
		padding: #{$i}rpx 0;
	}

	.pt#{$i} {
		padding-top: #{$i}rpx !important;
	}

	.pb#{$i} {
		padding-bottom: #{$i}rpx !important;
	}

	.pr#{$i} {
		padding-right: #{$i}rpx !important;
	}

	.pl#{$i} {
		padding-left: #{$i}rpx !important;
	}

	//font-size
	.ft#{$i} {
		font-size: #{$i}rpx !important;
	}

	//border-radius
	.radius#{$i} {
		border-radius: #{$i}rpx !important;
	}
	.radiustr#{$i} {
		border-radius: #{$i}rpx #{$i}rpx 0 0 !important;
	}

	// z-index
	.z-index-#{$i} {
		z-index: #{$i};
	}

	//位置数值
	.left-#{$i} {
		left: #{$i}rpx;
	}

	.right-#{$i} {
		right: #{$i}rpx;
	}

	.top-#{$i} {
		top: #{$i}rpx;
	}

	.bottom-#{$i} {
		bottom: #{$i}rpx;
	}

	// 宽度数值
	.width-#{$i} {
		width: #{$i}rpx;
	}

	.height-#{$i} {
		height: #{$i}rpx;
	}
	.lineheight-#{$i} {
		line-height: #{$i}rpx;
	}
}
/**
 * flex  类
 */
// 主轴
$flex-jc: (
        'start': flex-start,
        'end': flex-end,
        'center': center,
        'between': space-between,
        'around': space-around,
        'evenly': space-evenly,
		'right':right,
);
// 侧轴
$flex-ai: (
        'start': flex-start,
        'end': flex-end,
        'center': center,
        'stretch': stretch,
        'baseline':baseline
);
//主轴 在这里循环我们上面定义的选择项
@each $flexKey, $flexValue in $flex-jc { 
  .jc-#{$flexKey} {
	display: flex;
    justify-content: $flexValue;
  }
}

// 侧轴
@each $flexKey, $flexValue in $flex-ai {
  .al-#{$flexKey} {
	display: flex;
    align-items: $flexValue;
  }
}
@for $i from 0 through 100 {
	.flex-#{$i} {
		flex:  #{$i} !important;
	}
	.flex-basis-#{$i}{
		flex-basis:  #{$i}rpx !important;
	}
	.flex-basis-#{$i}{
		flex-basis: $i* 10% !important;
	}
}
/* 定义边框样式 */

/* 定义边框样式列表 */
$styles: solid, dashed, dotted, double, groove, ridge, inset, outset;

/* 生成不同颜色和样式的边框类 */
@each $style in $styles {
	@each $name, $color in $colors {
		.bd-#{$style}-#{$name} {
		  border-bottom: 2rpx #{$style} $color;
		}
		.bdb-#{$style}-#{$name} {
		  border-bottom: 2rpx #{$style} $color;
		}
	}
}
.flex-col {
	display: flex;
	flex-direction: column;
}

.flex-row {
	display: flex;
	flex-direction: row !important;
}

.flex-wrap {
	display: flex;
	flex-wrap: wrap !important;
}

.clamp {
	/* #ifdef APP-PLUS-NVUE */
	lines: 1;
	/* #endif */
	/* #ifndef APP-PLUS-NVUE */
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: block;
	word-break: break-all;
	/* #endif */
}
.clamp2 {
	/* #ifdef APP-PLUS-NVUE */
	lines: 2;
	/* #endif */
	/* #ifndef APP-PLUS-NVUE */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	word-break: break-all;
	/* #endif */
}
.clamp3 {
	/* #ifdef APP-PLUS-NVUE */
	lines: 3;
	/* #endif */
	/* #ifndef APP-PLUS-NVUE */
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	word-break: break-all;
	/* #endif */
}

// 特殊的样式
/* 边框 */
.radius50 {
	border-radius: 50%;
}
.bordert {
	border: 2rpx solid transparent !important;
}
.tc {
	text-align: center;
}
.tr {
	text-align: right;
}
.placeholderStyle {
	font-size: 28rpx !important;
	color: #999999 !important;
	font-weight: normal !important;
}
/* 宽高 */
.w100 {
	width: 100%;
}
.h100{
	height: 100vh;
}

.overhide {
	overflow: hidden;
}
/* 定位 */
.posRelative {
	position: relative;
}
.posAbsort {
	position: absolute;
}
.posFixed {
	position: fixed;
}
.textline{
	text-decoration:line-through
}
